﻿(function($) {
	$.fn.jtip = function(opts) {

		opts = $.extend({fade: false, gravity: 'r'}, opts || {});
		var tip = null, cancelHide = false;

		this.hover(function() {

			if($(this).attr('tip') && $(this).attr('tip') !="")
			{
				$.data(this, 'cancel.jtip', true);
				var tip = $.data(this, 'active.jtip');
				if (!tip) {
					tip = $('<div class="jtip"><div class="jtip-inner">' + $(this).attr('tip') + '</div></div>');
					tip.css({position: 'absolute', zIndex: 1000});
					$(this).attr('title', '');
					$.data(this, 'active.jtip', tip);
				}
				var pos = $.extend({}, $(this).offset(), {width: this.offsetWidth, height: this.offsetHeight});
				tip.remove().css({top: 0, left: 0, visibility: 'hidden', display: 'block'}).appendTo(document.body);
				var actualWidth = tip[0].offsetWidth, actualHeight = tip[0].offsetHeight;
				switch (opts.gravity.charAt(0)) {
					/*
					case 'b':
						tip.css({top: pos.top + pos.height, left: pos.left + pos.width / 2 - actualWidth / 2}).addClass('jtip-b');
						break;
					case 't':
						tip.css({top: pos.top - actualHeight, left: pos.left + pos.width / 2 - actualWidth / 2}).addClass('jtip-t');
						break;
					case 'l':
						tip.css({top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth}).addClass('jtip-l');
						break;
					case 'r':
						tip.css({top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width}).addClass('jtip-r');
						break;
					*/
					case 'b':
						tip.css({top: pos.top + pos.height, left: pos.left + pos.width});
						break;
					case 't':
						tip.css({top: pos.top - actualHeight, left: pos.left + pos.width});
						break;
					case 'l':
						tip.css({top: pos.top + pos.height, left: pos.left - actualWidth});
						break;
					case 'r':
						tip.css({top: pos.top + pos.height, left: pos.left + pos.width});
						break;
				}
				if (opts.fade) {
					tip.css({opacity: 0, display: 'block', visibility: 'visible'}).animate({opacity: 1});
				} else {
					tip.css({visibility: 'visible'});
				}
			}

		}, function() {
			if($(this).attr('tip') && $(this).attr('tip') !="")
			{
				$.data(this, 'cancel.jtip', false);
				var self = this;
				setTimeout(function() {
					if ($.data(this, 'cancel.jtip')) return;
					var tip = $.data(self, 'active.jtip');
					if (opts.fade) {
						tip.stop().fadeOut(function() { $(this).remove(); });
					} else {
						tip.remove();
					}
				}, 100);
			}
		});

	};
})(jQuery);
